<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Web Mapping Application Help</title>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
    <script language="javascript" src="HelpFunctions.js" ></script>
    
    <style type="text/css">
        tr { height:50px; }
        #dirKey { height:20px; width:40px; }
    </style>
</head>
<body>
    <script>writeHeader();</script>
    
    <p class="sectionHead">
        Explore the map</p>
    <h1>Using the keyboard</h1>
    
    <p>You can use keyboard to move around and explore the map. These keys navigate the
        map <strong>when the mouse cursor is over the map area</strong>.</p>
        
    <table border="0" cellpadding="5" cellspacing="0" class="tableMain">
        <tr class="tableHeader">
            <th>Map action
            </th>
            <th>Keyboard shortcut
            </th>
            <th>Description
            </th>
        </tr>
        <tr class="evenRow">
            <td >Zoom in
            </td>
            <td align="center"><span class="key" >&nbsp;+&nbsp;</span>
            </td>
            <td>Each click of the plus key (on numeric keypad only) zooms in the map by a fixed amount when the focus is on the map.</td>
        </tr>
        
        <tr class="oddRow">
            <td>Zoom out
            </td>
            <td align="center"><span class="key">&nbsp;-&nbsp;</span>
            </td>
            <td>Each click of the minus key (on numeric keypad only) zooms out by a fixed amount when the focus is on the map.</td>
        </tr>
        
        <tr class="evenRow">
            <td>Recenter (pan) the map</td>
            <td align="center">
                <table style="padding-top:5px;" cellpadding="0" cellspacing="0">
                    <tr align="center" style="height:30px;">
                        <td><span class="key">Home</span></td>
                        <td><span class="key">Up</span></td>
                        <td><span class="key">Page&nbsp;Up</span></td></tr>
                    <tr align="center">
                        <td><span class="key">Left</span></td>
                        <td><img src="images/keyDirections.gif" alt="Key directions"
                         style="vertical-align:middle" />&nbsp;</td>
                        <td><span class="key">Right</span></td></tr>
                    <tr align="center">
                        <td><span class="key">End</span></td>
                        <td><span class="key">Down</span></td>
                        <td><span class="key">Page&nbsp;Down</span></td></tr>
                </table>
            </td>
            <td>These keys move the map a small amount with each click. 
                Arrow keys move vertically or horizontally.
                Home/End/PageUp/PageDown move diagonally. 
                To use these keys on a numeric keypad,
                turn off the number lock (Num Lock key).
                </td>
        </tr>
    </table>

</body>
</html>
